import * as echarts from 'echarts'



export const historyTimeData = (data) => {
  let xdata = data.heartbeatTime.map(item => {
    return item.substring(5)
  })
  let { thickSmoke, particleHaze, nonMethane } = data
  let option = {
    legend: {
      itemWidth: 14,
      itemHeight: 10,
      itemGap: 10,
      data: [
        { name: '油烟数值', textStyle: { color: '#00F8FF' } },
        { name: '颗粒物浓度', textStyle: { color: '#EFD635' } },
        { name: '非甲烷总烃', textStyle: { color: '#00FE9F' } },
      ],
      right: "1%",
      top: "3%",
      textStyle: { fontSize: 14, },
    },
    grid: {
      left: "1%",
      right: "1%",
      bottom: '5%',
      containLabel: true,
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
    },
    xAxis: [
      {
        type: "category",
        boundaryGap: false,
        axisLine: {
          lineStyle: {
            color: "#02C1C7",
          },
        },
        axisLabel: {
          // interval: 0,
          // rotate: 45,
          margin: 10,
          padding: [0, 0, 0, 0],
          color: '#02C1C7',
          textStyle: {
            fontSize: '.12rem'
          },
        },
        data: xdata,
      },
    ],
    yAxis: [
      {
        type: "value",
        name: "浓度(mg/m³)",
        nameTextStyle: {
          padding: [0, 0, 10, 35],
          fontSize: 14,
        },
        axisTick: {
          show: false,
        },
        axisLine: {
          lineStyle: {
            color: "#02C1C7",
          },
        },
        axisLabel: {
          margin: 10,
          textStyle: {
            fontSize: 16,
          },
        },
        splitLine: {
          lineStyle: {
            color: "#036265",
          },
        },
      },
    ],
    series: [
      {
        name: "油烟数值",
        type: "line",
        smooth: true,
        symbol: "circle",
        symbolSize: 5,
        showSymbol: false,
        lineStyle: {
          normal: {
            width: 1,
          },
        },
        areaStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(
              0,
              0,
              0,
              1,
              [
                {
                  offset: 0,
                  color: "rgba(0, 248, 255, 0.6)",
                },
                {
                  offset: 0.8,
                  color: "rgba(0, 248, 255, 0.1)",
                },
              ],
              false
            ),
            shadowColor: "rgba(0, 0, 0, 0.1)",
            shadowBlur: 10,
          },
        },
        itemStyle: {
          normal: {
            color: "rgb(0, 248, 255)",
            borderColor: "rgba(0, 248, 255,1)",
            borderWidth: 12,
          },
        },
        data: thickSmoke,
      },
      {
        name: "颗粒物浓度",
        type: "line",
        smooth: true,
        symbol: "circle",
        symbolSize: 5,
        showSymbol: false,
        lineStyle: {
          normal: {
            width: 1,
          },
        },
        areaStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(
              0,
              0,
              0,
              1,
              [
                {
                  offset: 0,
                  color: "rgba(239, 214, 53,.6)",
                },
                {
                  offset: 0.8,
                  color: "rgba(239, 214, 53,.1)",
                },
              ],
              false
            ),
            shadowColor: "rgba(0, 0, 0, 0.1)",
            shadowBlur: 10,
          },
        },
        itemStyle: {
          normal: {
            color: "rgb(239, 214, 53)",
            borderColor: "rgba(239, 214, 53,.6)",
            borderWidth: 12,
          },
        },
        data: particleHaze,
      },
      {
        name: "非甲烷总烃",
        type: "line",
        smooth: true,
        symbol: "circle",
        symbolSize: 5,
        showSymbol: false,
        lineStyle: {
          normal: {
            width: 1,
          },
        },
        areaStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(
              0,
              0,
              0,
              1,
              [
                {
                  offset: 0,
                  color: "rgba(0, 254, 159,0.6)",
                },
                {
                  offset: 0.8,
                  color: "rgba(0, 254, 159,0.1)",
                },
              ],
              false
            ),
            shadowColor: "rgba(0, 0, 0, 0.1)",
            shadowBlur: 10,
          },
        },
        itemStyle: {
          normal: {
            color: "rgb(0, 254, 159)",
            borderColor: "rgba(0, 254, 159,0.6)",
            borderWidth: 12,
          },
        },
        data: nonMethane,
      },
    ],
  }

  return option
}